<template>
	<a-modal title="新增系统附属信息表" :width="900" :visible="visible" :confirmLoading="confirmLoading" @ok="handleSubmit"
		@cancel="handleCancel">
		<a-spin :spinning="confirmLoading">
			<a-form :form="form">

				<a-form-item v-show="false">
					<a-input v-decorator="['sysname',{ initialValue: '-1' }]" />
				</a-form-item>
				<!-- <a-form-item label="系统编号" :labelCol="labelCol" :wrapperCol="wrapperCol" has-feedback>
					<a-input placeholder="请输入系统编号"
						v-decorator="['sysid', {rules: [{required: true, message: '请输入系统编号！'}]}]" />
				</a-form-item> -->
				<!-- <a-form-item label="系统名称" :labelCol="labelCol" :wrapperCol="wrapperCol" has-feedback>
					<a-input placeholder="请输入系统名称" v-decorator="['sysname']" />
				</a-form-item> -->

				<a-form-item label="系统名称" :labelCol="labelCol" :wrapperCol="wrapperCol" has-feedback>
					<a-select v-decorator="['sysid',{rules: [{ required: true, message: '请选择关联系统！' }]}]"
						style="width: 100%" placeholder="请选择关联系统" :showArrow="true" :maxTagCount="10">
						<a-select-option v-for="(item,index) in xjb_sysidsData" :key="index" :value="item.code">
							{{ item.code }}-{{ item.name }}
						</a-select-option>
					</a-select>
				</a-form-item>

				<a-form-item label="属性名称" :labelCol="labelCol" :wrapperCol="wrapperCol" has-feedback>
					<a-input placeholder="请输入属性名称"
						v-decorator="['name', {rules: [{required: true, message: '请输入属性名称！'}]}]" />
				</a-form-item>
				<a-form-item label="属性值" :labelCol="labelCol" :wrapperCol="wrapperCol" has-feedback>
					<a-input placeholder="请输入属性值"
						v-decorator="['value', {rules: [{required: true, message: '请输入属性值！'}]}]" />
				</a-form-item>

				<a-form-item v-show="false">
					<a-input v-decorator="['vflag',{ initialValue: '1' }]" />
				</a-form-item>

			</a-form>
		</a-spin>
	</a-modal>
</template>

<script>
	import {
		xjbSysdetailExtAdd
	} from '@/api/modular/main/xjbsysdetailext/xjbSysdetailExtManage'
	export default {
		data() {
			return {
				xjb_sysidsData: [],
				labelCol: {
					xs: {
						span: 24
					},
					sm: {
						span: 5
					}
				},
				wrapperCol: {
					xs: {
						span: 24
					},
					sm: {
						span: 15
					}
				},
				visible: false,
				confirmLoading: false,
				form: this.$form.createForm(this)
			}
		},
		created() {
			this.getxjbSysdetailList()
		},
		methods: {
			getxjbSysdetailList() {
				this.xjb_sysidsData = this.$options.filters['dictData']('xjb_sysdetail')
			},
			// 初始化方法
			add(record) {
				this.visible = true
			},
			/**
			 * 提交表单
			 */
			handleSubmit() { 
				const {
					form: {
						validateFields
					}
				} = this
				this.confirmLoading = true
				validateFields((errors, values) => {
					if (!errors) {
						for (const key in values) {
							if (typeof(values[key]) === 'object' && values[key] != null) {
								values[key] = JSON.stringify(values[key])
							}
						}
						xjbSysdetailExtAdd(values).then((res) => {
							if (res.success) {
								this.$message.success('新增成功')
								this.confirmLoading = false
								this.$emit('ok', values)
								this.handleCancel()
							} else {
								this.$message.error('新增失败') // + res.message
							}
						}).finally((res) => {
							this.confirmLoading = false
						})
					} else {
						this.confirmLoading = false
					}
				})
			},
			handleCancel() {
				this.form.resetFields()
				this.visible = false
			}
		}
	}
</script>
